<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <script src="js/libs/resize.js"></script>
    <!-- build:css  css/z.min.css-->
    <link rel="stylesheet" href="css/framework7.ios.min.css" />
    <link rel="stylesheet" href="css/f7.css" />
    <link rel="stylesheet" href="css/common.css" />
    <link rel="stylesheet" href="css/style/rank.css">
    <title>排行榜</title>
</head>

<body>
    <div class="views">
        <div id="mainView" class="view view-main">
            <div class="navbar navbar-hidden hide"></div>

            <div class="pages">
                <div data-page="repairList" class="page">

                    <!-- 列表-->
                    <div id="page-content" class="page-content">
                        <div class="header">
                            <span class="test">薪酬排行榜</span>
                            <img class="switch-img" src="./img/down.png" width="12px" height="12px" alt="">
                        </div>
                        <div class="content">
                            <div class="list-block">

                                <ul id="rank-list">

                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="picker-modal picker-info">
                        <div class="toolbar">
                            <div class="toolbar-inner">
                                <div class="left"></div>
                                <div class="right">
                                    <a href="#" class="close-picker">取消</a>
                                </div>
                            </div>
                        </div>
                        <div class="picker-modal-inner" style="overflow-x: scroll">
                            <div class="content-block">
                                <div class="list-block">
                                    <ul id="province">
                                        <li class="item-content" data-id="salary" data-text="薪酬排行榜">
                                            <div class="item-inner">
                                                <div class="item-title">薪酬排行榜</div>
                                            </div>
                                        </li>
                                        <li class="item-content" data-id="benke" data-text="本科职业排行榜">
                                            <div class="item-inner">
                                                <div class="item-title">本科职业排行榜</div>
                                            </div>
                                        </li>
                                        <li class="item-content" data-id="zhuanke" data-text="专科职业排行榜">
                                            <div class="item-inner">
                                                <div class="item-title">专科职业排行榜</div>
                                            </div>
                                        </li>
                                        <li class="item-content" data-id="gril" data-text="妹子最多">
                                            <div class="item-inner">
                                                <div class="item-title">妹子最多</div>
                                            </div>
                                        </li>
                                        <li class="item-content" data-id="major" data-text="专业排行榜">
                                            <div class="item-inner">
                                                <div class="item-title">专业排行榜</div>
                                            </div>
                                        </li>
                                        <li class="item-content" data-id="compete" data-text="竞争力排行榜">
                                            <div class="item-inner">
                                                <div class="item-title">竞争力排行榜</div>
                                            </div>
                                        </li>
                                        <li class="item-content" data-id="employee" data-text="就业综合排行榜">
                                            <div class="item-inner">
                                                <div class="item-title">就业综合排行榜</div>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <!-- Links popover -->
    <!--##############模板加载 报修列表 {{#if isFirstLoad}} {{/if}}#####################-->
    <script type="text/template7" id="tplBenke">
        <div class="rank-exhibition">
            <span class="ranking">排名</span>
            <span class="school-name">专业名称</span>
            <span>毕业5年薪酬</span>
        </div>
        {{#each this}}
          <li class="item-content">
            <div class="item-inner">
              <div class="item-title">
                <div class="rank-content" >
                    <span class="rank-index" >{{formatIndex @index}}</span>
                    <div>
                        <p>
                            <span class="title" >{{major.label}}</span> 
                            <span class="desc" >{{bigCategory.label}}</span>
                        </p>
                    </div>
                </div>
              </div>
              <div class="item-after">￥{{salaryFactor}}</div>
            </div>
          </li>
        {{/each}}
    </script>
    <script type="text/template7" id="tplGril">
        <div class="rank-exhibition">
            <span class="ranking">排名</span>
            <span class="school-name">学校名称</span>
            <span>女生比例</span>
        </div>
        {{#each this}}
        <li class="item-content">
            <div class="item-inner">
              <div class="item-title">
                <div class="rank-content" >
                    <span class="rank-index" >{{sort}}</span>
                    <div>
                        <p>
                            <span class="title" >{{college}}</span> 
                            <span class="desc" >{{province}}</span>
                        </p>
                        <p class="rank-desc" >
                            <span class="desc" >{{category}}</span>
                        </p>
                    </div>
                </div>
              </div>
              <div class="item-after">{{formatRate rate}}%</div>
            </div>
          </li>
        {{/each}}
    </script>
    <script type="text/template7" id="tplMajorsalary">
        <div class="rank-exhibition">
            <span class="ranking">排名</span>
            <span class="school-name">专业名称</span>
            <span>毕业5年薪酬</span>
        </div>
        {{#each this}}
          <li class="item-content">
            <div class="item-inner">
              <div class="item-title">
                <div class="rank-content" >
                    <span class="rank-index" >{{sort}}</span>
                    <div>
                        <p>
                            <span class="title" >{{major}}</span> 
                            <span class="desc" >{{category}}</span>
                        </p>
                    </div>
                </div>
              </div>
              <div class="item-after">￥{{salary}}</div>
            </div>
          </li>  
        {{/each}}
    </script>
    <script type="text/template7" id="tplXinchou">
        <div class="rank-exhibition">
            <span class="ranking">排名</span>
            <span class="school-name">学校名称</span>
            <span>毕业5年薪酬</span>
        </div>
        {{#each this}}
        <li class="item-content">
            <div class="item-inner">
              <div class="item-title">
                <div class="rank-content" >
                    <span class="rank-index" >{{sort}}</span>
                    <div>
                        <p>
                            <span class="title" >{{college}}</span> 
                            <span class="desc" >{{province}}</span>
                        </p>
                        <p class="rank-desc">
                            <span class="desc" >{{category}}</span>
                            <span class="desc" >{{degree}}</span>
                        </p>
                    </div>
                </div>
              </div>
              <div class="item-after">￥{{salary}}</div>
            </div>
          </li>
        {{/each}}
    </script>
    <script type="text/template7" id="tplCompete">
        <div class="rank-exhibition">
            <span class="ranking">排名</span>
            <span class="school-name">学校名称</span>
        </div>
        {{#each this}}
        <li class="item-content">
            <div class="item-inner">
              <div class="item-title">
                <div class="rank-content" >
                    <span class="rank-index" >{{sort}}</span>
                    <div>
                        <p>
                            <span class="title" >{{college}}</span> 
                            <span class="desc" >{{province}}</span>
                        </p>
                        <p class="rank-desc">
                            <span class="desc" >{{category}}</span>
                            <span class="desc" >{{degree}}</span>
                        </p>
                    </div>
                </div>
              </div>
            </div>
          </li>
        {{/each}}
    </script>
    <script type="text/template7" id="tplEmployee">
        <div class="rank-exhibition">
            <span class="ranking">排名</span>
            <span class="school-name">学校名称</span>
            <span>学校评级</span>
        </div>
        {{#each this}}
        <li class="item-content">
            <div class="item-inner">
              <div class="item-title">
                <div class="rank-content" >
                    <span class="rank-index" >{{sort}}</span>
                    <div>
                        <p>
                            <span class="title" >{{college}}</span> 
                            <span class="desc" >{{province}}</span>
                        </p>
                        <p class="rank-desc">
                            <span class="desc" >{{category}}</span>
                            <span class="desc" >{{degree}}</span>
                        </p>
                    </div>
                </div>
              </div>
              <div class="item-after">{{grade}}</div>
            </div>
          </li>
        {{/each}}
    </script>
    <!-- 外部依赖 -->
    <!-- <script type="text/javascript" src="js/libs/vconsole.min.js"></script> -->
    <script type="text/javascript" src="js/libs/framework7.min.js"></script>
    <script type="text/javascript" src="js/libs/jquery-3.3.1.min.js"></script>
    <!-- 初始化 -->
    <script src="js/init/f7.js"></script>
    <script src="js/init/tplManager.js"></script>
    <!-- 公共方法 -->
    <script src="js/utils/utils.js"></script>
    <!-- ajax -->
    <script src="js/server/http.js"></script>
    <!-- 页面逻辑 -->
    <script src="js/rank.js"></script>
    <script src="js/index.js"></script>
    <!-- endbuild -->

</body>

</html>